<div id="wrapper-container">
    <div class="lightbox-content01">

        <div class="wrapper-box13-02">
            <div class="box13">
                <div class="box13-main">
                    <div class="link-section">
                        <ul class="general-list02">
                            <li><a onclick="getProvice('1')" href="javascript:;" class="region region_1 active"><span>Miền Bắc</span></a></li>
                            <li><a onclick="getProvice('2')" href="javascript:;" class="region region_2"><span>Miền Trung</span></a></li>
                            <li><a onclick="getProvice('3')" href="javascript:;" class="region region_3"><span>Miền Nam</span></a></li>
                            <li style="float: right"><img src="http://banbecdn.net/images/graphics/loading.gif" class="loading" style="display: none;"></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
        <div style="padding:0px 0px 0px 10px;" class="reg-select-school">
            <div class="reg-wrapper-block01">
                <p>Tỉnh thành theo khu vực:</p>
                <div style="padding:0px 0px 0px 10px;" class="reg-block01">
                    <div id="list-provice" class="reg-block01-main" style="display: block;"><ul class="reg-list01">
                            <li><a onclick="getTown('4')" class="provice provice_4" href="javascript:;"><span>Bắc Giang</span></a></li>
                            <li><a onclick="getTown('5')" class="provice provice_5" href="javascript:;"><span>Bắc Kạn</span></a></li>
                            <li><a onclick="getTown('7')" class="provice provice_7" href="javascript:;"><span>Bắc Ninh</span></a></li>
                            <li><a onclick="getTown('15')" class="provice provice_15" href="javascript:;"><span>Cao Bằng</span></a></li>
                            <li><a onclick="getTown('17')" class="provice provice_17" href="javascript:;"><span>Hà Giang</span></a></li>
                            <li><a onclick="getTown('18')" class="provice provice_18" href="javascript:;"><span>Hà Nam</span></a></li>
                            <li><a onclick="getTown('19')" class="provice provice_19 active" href="javascript:;"><span>Hà Nội</span></a></li>
                            <li><a onclick="getTown('21')" class="provice provice_21" href="javascript:;"><span>Hải Dương</span></a></li>
                            <li><a onclick="getTown('22')" class="provice provice_22" href="javascript:;"><span>Hải Phòng</span></a></li>
                            <li><a onclick="getTown('25')" class="provice provice_25" href="javascript:;"><span>Hòa Bình</span></a></li>
                            <li><a onclick="getTown('26')" class="provice provice_26" href="javascript:;"><span>Hưng Yên</span></a></li>
                            <li><a onclick="getTown('30')" class="provice provice_30" href="javascript:;"><span>Lai Châu</span></a></li>
                            <li><a onclick="getTown('32')" class="provice provice_32" href="javascript:;"><span>Lạng Sơn</span></a></li>
                            <li><a onclick="getTown('33')" class="provice provice_33" href="javascript:;"><span>Lào Cai</span></a></li>
                            <li><a onclick="getTown('35')" class="provice provice_35" href="javascript:;"><span>Nam Định</span></a></li>
                            <li><a onclick="getTown('37')" class="provice provice_37" href="javascript:;"><span>Ninh Bình</span></a></li>
                            <li><a onclick="getTown('39')" class="provice provice_39" href="javascript:;"><span>Phú Thọ</span></a></li>
                            <li><a onclick="getTown('44')" class="provice provice_44" href="javascript:;"><span>Quảng Ninh</span></a></li>
                            <li><a onclick="getTown('47')" class="provice provice_47" href="javascript:;"><span>Sơn La</span></a></li>
                            <li><a onclick="getTown('49')" class="provice provice_49" href="javascript:;"><span>Thái Bình</span></a></li>
                            <li><a onclick="getTown('50')" class="provice provice_50" href="javascript:;"><span>Thái Nguyên</span></a></li>
                            <li><a onclick="getTown('55')" class="provice provice_55" href="javascript:;"><span>Tuyên Quang</span></a></li>
                            <li><a onclick="getTown('57')" class="provice provice_57" href="javascript:;"><span>Vĩnh Phúc</span></a></li>
                            <li><a onclick="getTown('58')" class="provice provice_58" href="javascript:;"><span>Yên Bái</span></a></li>
                            <li><a onclick="getTown('62')" class="provice provice_62" href="javascript:;"><span>Điện Biên</span></a></li>

                        </ul></div>
                    <div class="reg-block01-main none-border">
                        <div class="reg-wrapper-search">
                            <div class="reg-search">
                                <div class="right"><input type="button" style="display:none" id="addTown" class="reg-them-btn"></div>
                                <div class="reg-search-main">

                                    <input type="button" tabindex="2" name="searchbtn" value="" class="reg-search-btn right" id="btn-search">
                                    <input type="text" name="searchtext" value="" class="general reg-search-field" tabindex="1" onfocus="if(this.value==this.defaultValue) this.value=''; this.style.color = '#333'" onblur="if(this.value==''){this.value=this.defaultValue; this.style.color = '#838383'} " id="search" style="color: rgb(51, 51, 51);">

                                </div>
                            </div>
                            <div class="reg-label">Bạn muốn tìm:</div>
                            <div class="clear"></div>
                        </div>
                    </div>

                    <div style="padding: 0px; margin: 0px;" class="reg-block01-main  none-border">
                        <div id="list-network" style="display: block;"><ul class="reg-list02">
                                <li><a onclick="insertTown('233','Huyện Ba Vì')" href="javascript:;" class="tabindex"><span>Huyện Ba Vì</span></a></li>
                                <li><a onclick="insertTown('241','Huyện Quốc Oai')" href="javascript:;" class="tabindex"><span>Huyện Quốc Oai</span></a></li>
                                <li><a onclick="insertTown('234','Huyện Chương Mỹ')" href="javascript:;" class="tabindex"><span>Huyện Chương Mỹ</span></a></li>
                                <li><a onclick="insertTown('236','Huyện Hoài Đức')" href="javascript:;" class="tabindex"><span>Huyện Hoài Đức</span></a></li>
                                <li><a onclick="insertTown('238','Huyện Mỹ Đức')" href="javascript:;" class="tabindex"><span>Huyện Mỹ Đức</span></a></li>
                                <li><a onclick="insertTown('242','Huyện Sóc Sơn')" href="javascript:;" class="tabindex"><span>Huyện Sóc Sơn</span></a></li>
                                <li><a onclick="insertTown('243','Huyện Thạch Thất')" href="javascript:;" class="tabindex"><span>Huyện Thạch Thất</span></a></li>
                                <li><a onclick="insertTown('246','Huyện Thường Tín')" href="javascript:;" class="tabindex"><span>Huyện Thường Tín</span></a></li>
                                <li><a onclick="insertTown('250','Huyện Đông Anh')" href="javascript:;" class="tabindex"><span>Huyện Đông Anh</span></a></li>
                                <li><a onclick="insertTown('235','Huyện Gia Lâm')" href="javascript:;" class="tabindex"><span>Huyện Gia Lâm</span></a></li>
                                <li><a onclick="insertTown('237','Huyện Mê Linh')" href="javascript:;" class="tabindex"><span>Huyện Mê Linh</span></a></li>
                                <li><a onclick="insertTown('239','Huyện Phú Xuyên')" href="javascript:;" class="tabindex"><span>Huyện Phú Xuyên</span></a></li>
                                <li><a onclick="insertTown('240','Huyện Phúc Thọ')" href="javascript:;" class="tabindex"><span>Huyện Phúc Thọ</span></a></li>
                                <li><a onclick="insertTown('247','Huyện Từ Liêm')" href="javascript:;" class="tabindex"><span>Huyện Từ Liêm</span></a></li>
                                <li><a onclick="insertTown('249','Huyện Đan Phượng')" href="javascript:;" class="tabindex"><span>Huyện Đan Phượng</span></a></li>
                                <li><a onclick="insertTown('244','Huyện Thanh Oai')" href="javascript:;" class="tabindex"><span>Huyện Thanh Oai</span></a></li>
                            </ul>
                            <div class="wrapper-pagination">
                                <div class="right">
                                    <ul class="pagination">
                                        <li class="active">1</li>  <li><a onclick="getPaging(2);" href="javascript:void(0);">2</a></li> <li class="next"><a onclick="getPaging(2);" href="javascript:void(0);"><img width="6" height="9" alt=" " src="http://banbecdn.net/images/buttons/next-btn.gif"></a></li>        </ul>
                                    <div class="clear"></div>
                                </div>
                                <div class="clear"></div>
                            </div>
                        </div>
                    </div>


                </div>

            </div>
        </div>
    </div>




    <script language="javascript">
        var kw = '';
        var timeout =0 ;
        var provice = 24;
        getTown(24);

        function getProvice(_idArea){
            $('.loading').show();
            $('#search').val('');
            kw = '';
            $('.region').removeClass('active');
            $('.region_'+_idArea).addClass('active');
            $.ajax({
                type: "POST",
                url: 'http://banbe.net/system/register/getprovice',
                data: {type: 4, idArea: _idArea },
                success: function(msg){
                    $('.loading').hide();
                    $('#list-provice').hide();
                    $('#list-provice').html(msg);
                    $('#list-provice').fadeIn(300);

                    $('#list-network').hide();
                    if(_idArea == 1){
                        getTown(19);
                        provice = 19;
                    } 
                    else if(_idArea == 2) {
                        getTown(59);
                        provice = 59;
                    }
                    else if(_idArea == 3) {
                        getTown(24);
                        provice = 24;
                    }               
                }
            });
            return false;
        }

        function getTown(_idProvice){
            $('.loading').show();
            $('#search').val('');
            kw = '';
            provice = _idProvice;
            $('.provice').removeClass('active');
            $('.provice_'+_idProvice).addClass('active');
            $.ajax({
                type: "POST",
                url: 'http://banbe.net/system/register/gettown',
                data: {type: 4, idProvice: _idProvice },
                success: function(msg){
                    $('.loading').hide();
                    $('#list-network').hide();
                    $('#list-network').html(msg);
                    $('#list-network').fadeIn(300);
                }
            });
            return false;
        }

        function getPaging(_page){
            $('.loading').show();
            if(kw != ''){
                $.ajax({
                    type: "POST",
                    url: 'http://banbe.net/system/register/gettown',
                    data: {type: 4, idProvice:provice, page: _page, kw: kw },
                    success: function(msg){
                        $('.loading').hide();
                        $('#list-network').hide();
                        $('#list-network').html(msg);
                        $('#list-network').fadeIn(300);
                    }
                });
            }else{
                $.ajax({
                    type: "POST",
                    url: 'http://banbe.net/system/register/gettown',
                    data: {type: 4, idProvice:provice, page: _page },
                    success: function(msg){
                        $('.loading').hide();
                        $('#list-network').hide();
                        $('#list-network').html(msg);
                        $('#list-network').fadeIn(300);
                    }
                });
            }
            return false;
        }

        function insertTown(idTown, name){
            window.parent.insertLocation(idTown, name, '4','1' );
       
            window.parent.Lightbox.hide();
        }


        $(function() {
            $('#search').keyup(function(){
                searchTown()
            });

            $('#btn-search').click(function(){
                searchTown();
            });

            function searchTown(){
                $('#addTown').hide();
                if(timeout) {
                    clearTimeout(timeout);
                }
                timeout = setTimeout(function(){
                    $('.loading').show();
                    $('#search').val(ltrim($('#search').val()));
                    kw = $.trim($('#search').val());
                    $.ajax({
                        type: "POST",
                        url: 'http://banbe.net/system/register/gettown',
                        data: {type: 4, idProvice:provice, kw:$('#search').val() },
                        success: function(msg){
                            $('.loading').hide();
                            $('#list-network').hide();
                            $('#list-network').html(msg);
                            $('#list-network').fadeIn(300);

                            if(msg.match(/Hiện chưa có dữ liệu/ig) == "Hiện chưa có dữ liệu"){
                                if(4 !=4){
                                    $('#addTown').show();
                                }
                                $('#nameTown').html($('#search').val());
                            }
                        }
                    });
                }, 400);
                return false;
            }

            $('#addTown').click(function(){
                $.ajax({
                    type: "POST",
                    url: domain +'/system/register/adddraf',
                    data: {typedraf:2, name:$('#search').val()},
                    success: function(msg){
                        insertTown(0,$.trim($('#search').val()));
                    }
                });

            });
        });

        function ltrim ( str, charlist ) {
            charlist = !charlist ? ' \\s\u00A0' : (charlist+'').replace(/([\[\]\(\)\.\?\/\*\{\}\+\$\^\:])/g, '$1');
            var re = new RegExp('^[' + charlist + ']+', 'g');
            return (str+'').replace(re, '');
        }
    </script>

</div>